<template>
  <div class="self_bottom">

    <!-- 上部菜单 -->
    <div class="self_wrapper">
      <div class="self_menulist" v-for="(v,i) in MenuOne" :key="i">
        <div class="self_menutitle">
          <img class="self_menuicon" :src="v.icon" alt="">
          <span class="self_menuname" v-text="v.title"/>
        </div>
        <div class="self_menubtn" @click="e_gopage(v.path)">
          <span v-text="v.btnTitle"/>
        </div>
      </div>
    </div>

    <!-- 中部菜单 -->
    <div class="self_centerMenu">
      <!-- 中部菜单头部区域 -->
      <div class="self_wrapper">
        <div class="self_centerMenu_top">
          <div class="self_centerMenu_topTitle">
            <img class="self_menuicon" :src="mine" alt="">
            <span class="self_menuname">我的订单</span>
          </div>
          <div class="self_centerMenu_topBtn" @click="e_goauction(1)">
            <span>查看全部</span>
            <i class="icon icon-right"></i>
          </div>
        </div>
      </div>

      <!-- 中部菜单中部区域 -->
      <div class="self_centerMenu_center">
        <div class="self_centerMenu_centerBtn" v-for="(v,i) in centerMenu" :key="i+'cc'" @click="e_goauction(v.id)">
          <Badge :count="auctionArr[i]">
            <a href="#" class="demo-badge"></a>
          </Badge>
          <img class="centerbtnicon" :src="v.icon" alt="">
          <span v-text="v.title"/>
        </div>
      </div>

      <!-- 中部广告区域 -->
      <div class="self_centeradvertising" @click="_skipDetail(centerICON.isClick, centerICON.goodsSkuId)">
        <img class="self_centeradIcon" :src="centerICON.advertiseImg" alt="">
      </div>

      <!-- 中部服务菜单区域 -->
      <div class="self_service">
        <!-- 服务标题 -->
        <div class="self_serviceTitle">
          <img class="self_menuicon" :src="serviceicon" alt="">
          <span class="self_menuname">我的服务</span>
        </div>
        <!-- 服务菜单 -->
        <div class="service_menulist" v-for="(v,i) in serviceTopMenu" :key="i+'a'" @click="e_gopage(v.path)">
          <div class="service_menulist_left">
            <img class="service_menulist_icon" :src="v.icon" alt="">
            <span class="service_menulist_name" v-text="v.title"/>
          </div>
          <div class="service_menulist_right">
            <i class="icon"></i>
          </div>
        </div>

        <div class="service_center">
          <div class="service_menulist" v-for="(v,i) in serviceCenterMenu" :key="i+'b'" @click="_skip(v.type ,v.path)">
            <div class="service_menulist_left">
              <img class="service_menulist_icon" :src="v.icon" alt="">
              <span class="service_menulist_name" v-text="v.title"/>
            </div>
            <div class="service_menulist_right">
              <i class="icon"></i>
            </div>
          </div>
        </div>

        <div class="service_menulist" v-for="(v,i) in serviceBottomMenu" :key="i+'c'" @click="e_gopage(v.path)">
          <div class="service_menulist_left">
            <img class="service_menulist_icon" :src="v.icon" alt="">
            <span class="service_menulist_name" v-text="v.title"/>
          </div>
          <div class="service_menulist_right">
            <i class="icon"></i>
          </div>
        </div>

      </div>
    </div>
    <div v-show="proxyShow">
      <proxy @close="_close"></proxy>
    </div>
  </div>
</template>

<script>
  import jingpai from '@imgs/self/jingpai.png'
  import zaipai from '@imgs/self/centerbtn_zaipai.png'
  import centerICON from '@imgs/self/centerICON.png'
  import serviceicon from '@imgs/self/serviceicon.png'
  import Proxy from '@c/proxy/proxy'
  import {
    MenuOne,
    centerMenu,
    serviceTopMenu,
    serviceCenterMenu,
    serviceBottomMenu,
  } from './selfMenu'
  import { vpost, sonpost, fpost, gpost, vlink } from '@api/axios'
  import { tokenPost, jtpost, gtpost, tokenLink, jtget } from '@api/axiosByToken'

  export default {
    name: '',
    data() {
      return {
        mine: jingpai,
        zaipai: zaipai,
        centerICON: {},
        serviceicon: serviceicon,
        MenuOne,
        serviceTopMenu,
        serviceCenterMenu,
        serviceBottomMenu,
        centerMenu,
        auctionArr: [],
        proxyShow: false,
      }
    },

    components: {
      Proxy,
    },

    computed: {},

    methods: {
      // 页面跳转
      e_gopage(p) {
        if (p === '') {
          //   window.location.href = 'tel:0531-8868-4365'
          Android.doTel('0531-8868-4365')
          return
        }
        if (!this.$store.state.signed && p != '/us') {
          this.$Message.warning('请先登录')
          // this.$router.push('/login')
          return
        }
        this.$router.push(p)
      },
      // 跳转到我的订单
      e_goauction(i) {
        if (!this.$store.state.signed) {
          this.$Message.warning('请先登录')
          return
        }
        this.$store.state.auctionIndex = i
        this.$router.push('/auction')
      },
      _skip(type, path) {
        if (!this.$store.state.signed && path != '/us') {
          this.$Message.warning('请先登录')
          // this.$router.push('/login')
          return
        }

        if (type === 0) {
          this.proxyShow = true
        } else {
          this.$router.push(path)
        }
      },
      getAuctionLength() {
        if (!this.$store.state.signed) {
          this.auctionArr = []
          return
        }
        let userInfo = {
          userId: window.localStorage.userId,
        }
        this.$store.state.loadding = true
        tokenPost(tokenLink.auction.length, userInfo).then(re => {
          this.$store.state.loadding = false
          if (re.status === 0) {
            this.auctionArr.push(re.data.waitDeliver)
            this.auctionArr.push(re.data.alreadyDeliver)
            this.auctionArr.push(0)
          } else {
            this.$Message.warning(re.msg)
          }
        })
      },
      // 获得广告图片
      _getAd() {
        let adData = {
          addLocation: 1,
        }
        vpost(vlink.home.ad, adData).then(re => {
          if (re.status === 0) {
            this.centerICON = re.data
          } else if (re.status === -1) {
            return
          } else {
            this.$Message.warning(re.msg)
          }
        })
      },
      // 点击广告跳转详情页
      _skipDetail(typeId, goodId) {
        console.log(typeId)
        if (typeId === 1 || typeId === undefined) {
          return
        } else {
          this.$router.push({
            path: 'dealDetail',
            name: 'DealDetail',
            query: {
              type: 1,
              id: goodId,
            },
          })
        }
      },
      // 关闭代理
      _close() {
        this.proxyShow = false
      },
    },

    mounted() {
      this.getAuctionLength()
      this._getAd()
    },
  }
</script>
